<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head lang="en">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JQuery Demo</title>
</head>
<body>
	<form id="demo_form">
		<table>
			<tr>
				<td>用户名：</td>
				<td><input type="text" name="username" value="sven"></input></td>
			</tr>
			<tr>
				<td>密码：</td>
				<td><input type="password" name="password" value="password"></input></td>
			</tr>
			<tr>
				<td>姓名：</td>
				<td><input type="text" name="name" value="SvenAugustus"></input></td>
			</tr>
			<tr>
				<td></td>
				<td><input type="button" value="提交" id="btn"></input></td>
			</tr>
		</table>
	</form>
	<p id="p_message" style='display:none;'>Hi,<label id="message"></label>.Welcome to Spring MVC.</p>
</body>
<script type="text/javascript" src="../../static/js/Utils.js"></script><!-- 依赖 -->
<script type="text/javascript" src="../../static/lib/jquery.min.js"></script><!-- 依赖 -->
<script type="text/javascript" src="../../static/lib/json2.js"></script><!-- 可选 -->
<script type="text/javascript" src="../../static/lib/layer/layer.js"></script><!-- 可选 -->
<script type="text/javascript" src="../../static/js/Invoker.js"></script>
<script type="text/javascript">
    $(function() {
	    $("#btn").click(function() {
		    var params = {};
			params.username = document.getElementsByName("username")[0].value;
		    params.password = document.getElementsByName("password")[0].value;
		    params.name = document.getElementsByName("name")[0].value;
			
			Invoker.async("AjaxDemoController", "sayHi", params, function(data){
				if(data.res_code == "00000"){
					$("#demo_form").hide();
			    	$("#p_message").show();
			    	$("#message").html(data.result.yourname);
				}else{
					alert('请求错误');
				}
			});
	    });
    });
</script>
</html>

